    <style include="certificate-shared cr-icons">
      .name {
        flex: auto;
      }

      .untrusted {
        color: var(--paper-red-700);
        font-weight: 500;
        margin-inline-end: 16px;
        text-transform: uppercase;
      }

      :host([is-last]) .list-item {
        border-bottom: none;
      }
    </style>
    <div class="list-item underbar">
      <div class="untrusted" hidden$="[[!model.untrusted]]">
        [[i18n('certificateManagerUntrusted')]]
      </div>
      <div class="name">[[model.name]]</div>
      <cr-policy-indicator indicator-type="[[getPolicyIndicatorType_(model)]]">
      </cr-policy-indicator>
      <cr-icon-button class="icon-more-vert" id="dots"
          title="[[i18n('moreActions')]]" on-click="onDotsClick_">
      </cr-icon-button>
      <cr-lazy-render id="menu">
        <template>
          <cr-action-menu role-description="[[i18n('menu')]]">
            <button class="dropdown-item" id="view"
                on-click="onViewClick_">
              [[i18n('certificateManagerView')]]
            </button>
            <button class="dropdown-item" id="edit"
                hidden$="[[!canEdit_(model)]]"
                on-click="onEditClick_">
              [[i18n('edit')]]
            </button>
            <button class="dropdown-item" id="export"
                hidden$="[[!canExport_(certificateType, model)]]"
                on-click="onExportClick_">
              [[i18n('certificateManagerExport')]]
            </button>
            <button class="dropdown-item" id="delete"
                hidden$="[[!canDelete_(model)]]"
                on-click="onDeleteClick_">
              [[i18n('certificateManagerDelete')]]
            </button>
          </cr-action-menu>
        </template>
      </cr-lazy-render>
    <div>
